import { useRequest } from "ahooks";
import { Button, Form, Input, message, Modal, Space } from "antd"
import { memo, useEffect } from "react";
import { getBaseConfig, putBaseConfig } from "../api/request";


const layout = {
    labelCol: { span: 7 },
    wrapperCol: { span: 15 },
};

const BaseConfig = () => {
    const [form] = Form.useForm();
    const { loading: getBaseConfigLoading, run: getBaseConfigRun } = useRequest(getBaseConfig, {
        manual: true,
        onSuccess: (result) => {
            if (result.code == 200) {
                form.setFieldsValue(result.data)
            }
        }
    })
    const { loading: putBaseConfigLoading, run: putBaseConfigRun } = useRequest(putBaseConfig, {
        manual: true,
        onSuccess: (result) => {
            if (result.code == 200) {
                message.success("保存成功")
            } else {
                message.error("更新失败")
            }
        }
    })

    useEffect(() => {
        if (open) {
            getBaseConfigRun()
        }
    }, [open])

    return <div className="bg-white flex justify-center rounded-[10px] min-w-[1200px]">
        <div className="flex-1 justify-center flex ">
            <img src="img/rag.png" className="h-[300px] mt-[140px]"/>
        </div>
        <div className="flex-1">
            <Form
                {...layout}
                form={form}
                name="control-hooks"
                className="mt-6"

                style={{ width: 800 }}
            >
                <Form.Item name="openai_base_url" label="LLM路径" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="openai_api_key" label="LLM密钥" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="openai_base_model" label="LLM模型" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>

                <Form.Item name="xinference_embedding_url" label="Embedding路径" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="xinference_embedding_model" label="Embedding名称" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="xinference_embedding_token" label="Embedding密钥" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>

                <Form.Item name="xinference_rerank_url" label="Rerank路径" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="xinference_rerank_model" label="Rerank名称" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item name="xinference_rerank_token" label="Rerank密钥" rules={[{ required: true }]}>
                    <Input />
                </Form.Item>
                <Form.Item >
                    <Space className="ml-[236px]">
                        <Button loading={putBaseConfigLoading} type="primary"
                            onClick={() =>
                                putBaseConfigRun(form.getFieldsValue())}>保存配置</Button>
                        <Button loading={putBaseConfigLoading}
                            onClick={() => {
                                window.open("http://10.10.40.102:13000/")
                            }}>渠道配置</Button>
                    </Space>
                </Form.Item>
            </Form>
        </div>
    </div>
}

export default memo(BaseConfig)